<template>
	<view>
		<u-popup v-model="open" :mode="params.mode" :border-radius="params.borderRadius" 
		:closeable="params.closeable" :close-icon-pos="params.closeIconPos" @close="close" >
				<view class="frame">
					<!-- <view class="submit-frame" @click="close">确定</view> -->
					<view class="flexcenter frame-title">{{title}}</view>
					<view style="width: 686rpx;z-index: 10;margin-left: 32rpx;margin-top: 30rpx;">
						<u-input style="background: #F2F3F5;max-height: 390rpx;margin-top: 40rpx;" v-model="value" :type="type" 
						:border="border" :height="height" :auto-height="autoHeight" />
						<view class="flexalign" style="margin-top: 50rpx;" @click="openPeople">
							<view class="frame-text" style="width: 100rpx;flex: 1;">接收人</view>
							<view class="frame-text text-1" style="width: 420rpx;text-align: right;display: flex;justify-content: flex-end;" >
								<view v-if="all">全部</view>
								<view v-else v-for="(item,index) in list " :key="index" style="text-align: right;">{{item.name}},</view>
							</view>
							<image src="/static/right.png" style="width: 14rpx;height: 24rpx;margin-left: 18rpx;" ></image>
						</view>
						<view class="button-send flexcenter">发送</view>
					</view>
				</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name:"createSignPop",
		props:{
			// 是否打开弹窗
			signPop:{
				type:Boolean,
				default:false
			},
			// 接收人列表
			list:{
				type:Array,
				default:[]
			},
			// 是否全选
			all:{
				type:Boolean,
				default:false
			}
		},
		data() {
			return {
				keyword:'',
				open:false,
				params:{
					mode:"bottom",
					borderRadius:24,
					closeable:true,
					closeIconPos:"top-right"
				},
				value: '',
				type: 'textarea',
				border: false,
				height: 390,
				autoHeight: true,
				radioIndex:null,
				checkedList:[],
				title:'签收消息'
			};
		},
		watch: {
			// New: 新值 | Old: 老值
			signPop(New, Old) {
				this.open = New
				console.log(`新值:${New} ——— 老值:${Old}`)
			},
		},
		computed:{
			
		},
		methods:{
			// 关闭回调
			close(e){
				console.log('弹窗收起',this.open)
				let params = {
				}
				this.$emit('createSignCloseSubmit',params)
			},
			// 打开接收人回调
			openPeople(){
				this.$emit('openPeopleSubimt')
			}
		}
	}
</script>

<style lang="less">
	.frame{
		width: 750rpx;
		height: 794rpx;
		background: #FFFFFF;
		border-radius: 24rpx 24rpx 0rpx 0rpx;
		
		.frame-title{
			padding-top: 20rpx;
			font-weight: normal;
			font-size: 36rpx;
			color: #000000;
		}
		
		.submit-frame{
			font-weight: 500;
			font-size: 32rpx;
			color: #0052D9;
			position: absolute;
			right: 32rpx;
		}
		.scroll-frame{
			// background: #000000;
			margin-top: 10rpx;
		}
		.name-text{
			margin-left: 24rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #333333;
			flex: 1;
		}
	}
	.checked-frame{
		margin-top: 20rpx;
		margin-left: 15rpx;
		font-weight: 500;
		font-size: 32rpx;
		color: #000000;
	}
	.frame-text{
		font-weight: 400;
		font-size: 30rpx;
		color: #000000;
		
	}
	.button-send{
		margin-top: 59rpx;
		margin-bottom: 58rpx;
		width: 686rpx;
		height: 80rpx;
		background: #0052D9;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-size: 30rpx;
		color: #FFFFFF;
	}
	.icon{
		width: 100rpx;
		height: 100rpx;
		// background: #888888;
		border-radius: 50%;
	}
</style>